<!--
  ~ ============LICENSE_START=======================================================
  ~  Copyright (C) 2021 Nordix Foundation
  ~  ================================================================================
  ~  Licensed under the Apache License, Version 2.0 (the "License");
  ~  you may not use this file except in compliance with the License.
  ~  You may obtain a copy of the License at
  ~
  ~        http://www.apache.org/licenses/LICENSE-2.0
  ~  Unless required by applicable law or agreed to in writing, software
  ~  distributed under the License is distributed on an "AS IS" BASIS,
  ~  WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
  ~  See the License for the specific language governing permissions and
  ~  limitations under the License.
  ~
  ~  SPDX-License-Identifier: Apache-2.0
  ~  ============LICENSE_END=========================================================
  -->
<div class="relationship-operations-container">
  <div id="relationship-operation-actions" class="actions">
    <a
        class="add-param-link add-btn"
        *ngIf="!enableAddOperation"
        data-tests-id="addInterfaceOperation"
        (click)="addOperation()">{{ 'OPERATION_ADD1' | translate }}</a>
  </div>
  <div id="operation-list-container" class="operation-list-container">
    <app-interface-operation-list [interfaceOperationList]="operationList" [readonly]="false" (onRemoveOperation)="onRemoveOperation($event)"></app-interface-operation-list>
  </div>
  <div class="operations-create-container">
    <div>
      <app-create-interface-operation *ngIf="enableAddOperation" [interfaceTypeMap]="interfaceTypeMap" (addOperation)="operationAdded($event)">
      </app-create-interface-operation>
    </div>
  </div>
</div>